<!--选手比较--上部分基本信息-->
<div class="player-compare-top ">

    <div class="selects-box flex-h-space">
        <div class="selects flex-h-space">
            <div class="p-select p-select-border p-select-icon area">
                <div class="p-select-header flex-h-mid p-tran">
                    <h3>选择地区</h3>
                </div>
                <div class="p-select-body">
                    <ul>
                        <li class="flex-h-mid"><h3>LCK </h3></li>
                        <li class="flex-h-mid"><h3>LPL</h3></li>
                        <li class="flex-h-mid"><h3>LMS</h3></li>
                    </ul>
                </div>
            </div>
            <div class="p-select p-select-border p-select-icon pos">
                <div class="p-select-header flex-h-mid p-tran">
                    <h3>选择位置</h3>
                </div>
                <div class="p-select-body">
                    <ul>
                        <li class="flex-h-mid"><h3>上路 </h3></li>
                        <li class="flex-h-mid"><h3>中路</h3></li>
                        <li class="flex-h-mid"><h3>下路</h3></li>
                    </ul>
                </div>
            </div>
            <div class="p-select p-select-border p-select-icon people">
                <div class="p-select-header flex-h-mid p-tran">
                    <h3>选择选手</h3>
                </div>
                <div class="p-select-body">
                    <ul>
                        <li class="flex-h-mid"><h3>ClearLove ClearLove ClearLove </h3></li>
                        <li class="flex-h-mid"><h3>Bjergsen</h3></li>
                        <li class="flex-h-mid"><h3>Faker</h3></li>
                        <li class="flex-h-mid"><h3>ClearLove </h3></li>
                        <li class="flex-h-mid"><h3>Bjergsen</h3></li>
                        <li class="flex-h-mid"><h3>Faker</h3></li>
                        <li class="flex-h-mid"><h3>ClearLove </h3></li>
                        <li class="flex-h-mid"><h3>Bjergsen</h3></li>
                        <li class="flex-h-mid"><h3>Faker</h3></li>
                        <li class="flex-h-mid"><h3>ClearLove </h3></li>
                        <li class="flex-h-mid"><h3>Bjergsen</h3></li>
                        <li class="flex-h-mid"><h3>Faker</h3></li>
                        <li class="flex-h-mid"><h3>ClearLove </h3></li>
                        <li class="flex-h-mid"><h3>Bjergsen</h3></li>
                        <li class="flex-h-mid"><h3>Faker</h3></li>

                        <li class="flex-h-mid"><h3>ClearLove </h3></li>
                        <li class="flex-h-mid"><h3>Bjergsen</h3></li>
                        <li class="flex-h-mid"><h3>Faker</h3></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="btn-compare p-tran">立即比较</div>
        <div class="selects flex-h-space">
            <div class="p-select p-select-border p-select-icon area">
                <div class="p-select-header flex-h-mid p-tran">
                    <h3>选择地区</h3>
                </div>
                <div class="p-select-body">
                    <ul>
                        <li class="flex-h-mid"><h3>LCK </h3></li>
                        <li class="flex-h-mid"><h3>LPL</h3></li>
                        <li class="flex-h-mid"><h3>LMS</h3></li>
                    </ul>
                </div>
            </div>
            <div class="p-select p-select-border p-select-icon pos">
                <div class="p-select-header flex-h-mid p-tran">
                    <h3>选择位置</h3>
                </div>
                <div class="p-select-body">
                    <ul>
                        <li class="flex-h-mid"><h3>上路 </h3></li>
                        <li class="flex-h-mid"><h3>中路</h3></li>
                        <li class="flex-h-mid"><h3>下路</h3></li>
                    </ul>
                </div>
            </div>
            <div class="p-select p-select-border p-select-icon people">
                <div class="p-select-header flex-h-mid p-tran">
                    <h3>选择选手</h3>
                </div>
                <div class="p-select-body">
                    <ul>
                        <li class="flex-h-mid"><h3>ClearLove </h3></li>
                        <li class="flex-h-mid"><h3>Bjergsen</h3></li>
                        <li class="flex-h-mid"><h3>Faker</h3></li>
                    </ul>
                </div>
            </div>
        </div>

    </div>

    <div class="compare-box flex-h-space">
       <div class="l">
           <ul>
               <li class="img-box"><img src="http://cdn.esportsmatrix.com/Content/images/uploaded/player/e504ba22-bd0a-4cc1-9370-35c05dd56c7c.jpg" alt="name"></li>
               <li class="name flex-h-center"><span class="p-arial">Perkz</span> </li>
               <li class="team flex-h-center">
                   <div class="team-inner flex-h-space">
                       <div class="flex-h-space">
                           <img class="team-logo" src="http://cdn.esportsmatrix.com/Content/images/uploaded/team/638b44a7-a9fa-4e15-9205-257a6f921d26.png" >
                           <span>中路</span>
                       </div>
                       <div class="flex-h-space">
                           <img class="area-logo" src="http://cdn.esportsmatrix.com/Content/images/uploaded/region/7d7f87f0-2648-4a18-b726-a705db19805d.png" >
                           <span>韩国</span>
                       </div>
                   </div>

               </li>
               <li class="rank-box">
                   <div class="rank">
                       <div class="r1">全球排行：<span class="p-impact">1</span></div>
                       <div class="r2">实力评分：<span class="p-impact">1914</span></div>
                       <div class="r3">Matrix价值：<span class="p-impact">10.6 <i>M</i></span></div>
                   </div>
               </li>
           </ul>
       </div>
       <div class="m">

           <div class="bar-container p-tran">
               <div class="bar-text-space flex-h-space">
                   <div class="left p-arial"><span>14.2K</span></div>
                   <div class="center">场均经济</div>
                   <div class="right p-arial"><span>15.7K</span></div>
               </div>
               <div class="bar-block"><div class="bar-item"></div></div>
           </div>
           <div class="bar-container p-tran">
               <div class="bar-text-space flex-h-space">
                   <div class="left p-arial"><span>67.8%</span></div>
                   <div class="center">场均参战率</div>
                   <div class="right p-arial"><span>70.8%</span></div>
               </div>
               <div class="bar-block"><div class="bar-item"></div></div>
           </div>
           <div class="bar-container p-tran">
               <div class="bar-text-space flex-h-space">
                   <div class="left p-arial"><span>20403.8</span></div>
                   <div class="center">英雄输出伤害</div>
                   <div class="right p-arial"><span>17361.9</span></div>
               </div>
               <div class="bar-block"><div class="bar-item"></div></div>
           </div>

           <div class="compare-chart" id="compareChart"></div>

       </div>
       <div class="r">
           <ul>
               <li class="img-box"><img src="http://cdn.esportsmatrix.com/Content/images/uploaded/player/4bac4289-9f05-47c0-903b-ecd81507f143.jpg" alt="name"></li>
               <li class="name flex-h-center"><span class="p-arial">Smeb</span> </li>
               <li class="team flex-h-center">
                   <div class="team-inner flex-h-space">
                       <div class="flex-h-space">
                           <img class="team-logo" src="http://cdn.esportsmatrix.com/Content/images/uploaded/team/638b44a7-a9fa-4e15-9205-257a6f921d26.png" >
                           <span>中路</span>
                       </div>
                       <div class="flex-h-space">
                           <img class="area-logo" src="http://cdn.esportsmatrix.com/Content/images/uploaded/region/7d7f87f0-2648-4a18-b726-a705db19805d.png" >
                           <span>韩国</span>
                       </div>
                   </div>

               </li>
               <li class="rank-box">
                   <div class="rank">
                       <div class="r1">全球排行：<span class="p-impact">1</span></div>
                       <div class="r2">实力评分：<span class="p-impact">1914</span></div>
                       <div class="r3">Matrix价值：<span class="p-impact">10.6 <i>M</i></span></div>
                   </div>
               </li>
           </ul>
       </div>
    </div>
</div>